<template>
	<view class="detail">
		<view class="uni-cardList">
			<uni-card margin="0" title="基础信息">
				<view class="content">
					<view class="content_list">
						<view>SN号:METER{{meter.meterId}}</view>
						<view class="content_item"></view>
					</view>
				</view>
			</uni-card>
		</view>


		<!--总计  -->
		<view class="uni-cardList">
			<uni-card margin="0" title="总计">
				<view class="content power_basic">
					<view class="content_list">
						<view>组合有功总电能:</view>
						<view class="content_item">{{meter.groupElel||'--'}}KWh</view>
					</view>

					<view class="content_list">
						<view>正向有功总电能:</view>
						<view class="content_item">{{meter.fpFKwh||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>反相有功总电能:</view>
						<view class="content_item">{{meter.rfpFKwh||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功1总电能:</view>
						<view class="content_item">{{meter.totalEleCombReac1||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功2总电能:</view>
						<view class="content_item">{{meter.totalEleCombReac2||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合有功费率1电能:</view>
						<view class="content_item">{{meter.comActiveElec1||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合有功费率2电能:</view>
						<view class="content_item">{{meter.comActiveElec2||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合有功费率3电能:</view>
						<view class="content_item">{{meter.comActiveElec3||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合有功费率4电能:</view>
						<view class="content_item">{{meter.comActiveElec4||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>正向有功尖电能:</view>
						<view class="content_item">{{meter.activeTipElec||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>正向有功峰电能:</view>
						<view class="content_item">{{meter.activePeakElec||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>正向有功平电能:</view>
						<view class="content_item">{{meter.activeFlatElec||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>正向有功谷电能:</view>
						<view class="content_item">{{meter.activeValleyElec||'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>反向有功尖电能:</view>
						<view class="content_item">{{'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>反向有功峰电能:</view>
						<view class="content_item">{{'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>反向有功平电能:</view>
						<view class="content_item">{{'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>反向有功谷电能:</view>
						<view class="content_item">{{'--'}}KWh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功1费率1电能:</view>
						<view class="content_item">{{meter.groupReactive1Elec1||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功1费率2电能:</view>
						<view class="content_item">{{meter.groupReactive1Elec2||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功1费率3电能:</view>
						<view class="content_item">{{meter.groupReactive1Elec3||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功1费率4电能:</view>
						<view class="content_item">{{meter.groupReactive1Elec4||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功2费率1电能:</view>
						<view class="content_item">{{meter.groupReactive2Elec1||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功2费率2电能:</view>
						<view class="content_item">{{meter.groupReactive2Elec2||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功2费率3电能:</view>
						<view class="content_item">{{meter.groupReactive2Elec3||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>组合无功2费率4电能:</view>
						<view class="content_item">{{meter.groupReactive2Elec4||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>正向有功总最大需量:</view>
						<view class="content_item">{{meter.totalMaximum||'--'}}kVARh</view>
					</view>
					
					<view class="content_list">
						<view>反向有功总最大需量:</view>
						<view class="content_item">{{meter.rtotalMaximum||'--'}}kVARh</view>
					</view>
					
				</view>
			</uni-card>
		</view>

		<!-- 历史 -->
		<view class="uni-cardList">
				<charts :did="did" :type="4" @sendMeter="sendMeter"/>
		</view>
	</view>
</template>

<script>
	import {
		getQueryMeterDetails
	} from "@/common/api/api.js"
	import charts from "@/pages/deviceDetail/monitorDetail/charts.vue"
	export default {
		components:{
			charts
		},
		props: {
			did: {
				type: String,
				default: '',
			}
		},
		data() {
			return {
				meter:{}
			}
		},
		mounted() {
			
		},
		methods: {
			sendMeter(e){
				this.meter = e
			}
		}
	}
</script>

<style scoped lang='scss'>
	.uni-cardList {
		margin-top: 8rpx;
		.content {
			display: flex;
			flex-wrap: wrap;
		
			.content_list {
				width: 50%;
				font-size: 24rpx;
				padding: 8rpx 0;
		
				.content_item {
					color: #333;
				}
			}
		}
	}

	

	.power_basic {
		border-top: 2rpx solid #ccc;
	}

	.acList {
		margin-top: 16rpx;
		border-top: 2rpx solid #ccc;
	}

	.content_dcList {
		.content_item {
			padding: 8rpx 0;
			display: flex;
			flex-wrap: wrap;

			.dcList_item {
				width: 25%;
			}

			.dtitle {
				text {
					background-color: #008B8B;
					padding: 4rpx;
					color: #fff;
				}
			}

			.atitle {
				text {
					background-color: #CD853F;
					padding: 4rpx;
					color: #fff;
				}
			}
		}
	}

	.content_basic {
		padding: 8rpx 0;
		display: flex;
		flex-wrap: wrap;
	}
</style>